<template>
  <div class="productProNew">
    <div class="title"><h1><span>编辑</span></h1></div>
    <form name="newContent" class="basicInfor">
      <div class="form-group required">
        <label :for="'name'+$attrs.text">旅行社名称：</label>
        <input autocomplete="off" type="text" class="form-control proName" :id="'name'+$attrs.text" placeholder="请输入旅行社名称" required v-model="traveladds.name" />
      </div>
      <div class="form-group required">
        <label class="destxt" :for="'rank'+$attrs.text">旅行社级别：</label>
        <input autocomplete="off" type="number" maxlength="1" min="1" max="5" class="form-control proName" :id="'rank'+$attrs.text" placeholder="请输入等级" required v-model="traveladds.rank" />
        <span class="g-tips">（请填写1~5之间的整数）</span>
      </div>
      <div class="form-group required">
        <label class="destxt" :for="'contactsName'+$attrs.text">联系人姓名：</label>
        <input autocomplete="off" type="text" class="form-control proName" :id="'contactsName'+$attrs.text" placeholder="请输入联系人姓名" required v-model="traveladds.contactsName" />
      </div>
      <div class="form-group required">
        <label class="destxt" :for="'contactsMobile'+$attrs.text">联系人电话：</label>
        <input autocomplete="off" type="number" min="1" class="form-control proName" :id="'contactsMobile'+$attrs.text" placeholder="请输入联系人电话" required v-model="traveladds.contactsMobile" />
      </div>
      <div class="form-group">
        <label class="destxt" :for="'demo'+$attrs.text">备注：</label>
        <textarea class="form-control proDes" :id="'demo'+$attrs.text" rows="6" placeholder="请输入备注信息" v-model="traveladds.demo"></textarea>
      </div>
      <button type="button" class="btn btn-info confirmBtn" @click="submitPro()">提交</button>
    </form>
  </div>
</template>
<script>
  import Site from '@/components/public/site'
  export default {
    data(){
      return{
        traveladds: {},
        travelViewHttp: '',
        addHttp: ''
      }
    },
    computed:{
      travelView(){ //获取详情
        return this.$store.state.interface.travelgencyView;
      },
      addtravelGency(){
        return this.$store.state.interface.addtravelGency;
      }
    },
    components:{
      Site
    },
    methods:{
      submitPro(){
        let self = this;
        let isMobile = /^(13|14|15|17|18)\d{9}$/
        if (self.traveladds.name === '') {
          layer.msg('请填写旅行社名称！');
          return false
        }
        if (self.traveladds.rank === '') {
          layer.msg('请填写等级！');
          return false
        }
        if (isNaN(self.traveladds.rank * 1)) {
          layer.msg('等级应为1~5的数字！');
          return false
        }
        if (self.traveladds.contactsName === '') {
          layer.msg('请填写联系人姓名！');
          return false
        }
        if (!isMobile.test(self.traveladds.contactsMobile)) {
          layer.msg('请填写11位有效手机号');
          return false
        }

        let formData =new FormData(); // 基础信息表单数据
        formData.append('id', self.traveladds.id);
        formData.append('name', self.traveladds.name);
        formData.append('rank', self.traveladds.rank);
        formData.append('contactsName', self.traveladds.contactsName);
        formData.append('contactsMobile', self.traveladds.contactsMobile);
        formData.append('demo', self.traveladds.demo);
        self.$ajax.post(self.addHttp,formData).then(function(res) {
          let result = res.data.result || '';
          if(res.data.code === '10000' && result.WbTravelGency ){
            layer.msg('修改成功！');
          }else{
            layer.msg('修改失败！');
          }
        },function(res) {
          layer.msg('修改失败！');
        });
      },
    },
    beforeMount(){
      let self = this;
      let url = self.addtravelGency;
      let sessionId = JSON.parse(sessionStorage.getItem('customer')).sid;
      self.addHttp ='${url}?sid=${sessionId}';
      self.travelViewHttp=`${self.travelView}?sid=${sessionId}`;
      self.$ajax.post(`${self.travelViewHttp}&id=${self.$attrs.proid}`).then(function(res) {
        if(res.data.code === '10000' ){
          self.traveladds = res.data.result.WbTravelGency;
        }else{
          layer.msg('加载失败！');
        }
      },function(res) {
        layer.msg('服务器错误！');
      });
    },
    mounted(){}
  }
</script>
<style lang="scss" scoped>
  form{
    display:block;
  }
  .title{
    color:#4e5e7e;
  }
  .site{
    margin-left: 77px;
    margin-top: 0.325rem;
  }
  .form-control.like-textarea, .form-control.proDes, .form-group .mainImg{
    width: 70%;
  }
</style>
